<template>
  <div>
    <!-- <link media="screen and (max-device-width:1280px)">
    <link media="screen and (min-device-width:1280px)"> -->
    <div class="page-title">问题查询</div>
    <div class="page-content">
      <el-form
        :inline="true"
        :model="filterQuery"
        @submit.native.prevent="handleSearch"
        label-position="right"
        label-width="180px"
      >
        <el-row>
          <el-col>
            <el-form-item label="被检单位">
              <treeselect
                :options="options"
                placeholder="请选择受检单位"
                v-model="filterQuery.companyCode"
                style="width: 280px"
              />
            </el-form-item>
            <el-form-item label="检查日期">
              <!-- <el-date-picker
                v-model="dateRange"
                type="daterange"
                align="right"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                style="width: 280px"
              >
              </el-date-picker> -->
              <el-date-picker
                type="date"
                v-model="filterQuery.startDate"
                placeholder="开始日期"
                style="width: 135px"
              ></el-date-picker>
              <span>-</span>
              <el-date-picker
                type="date"
                v-model="filterQuery.endDate"
                placeholder="结束日期"
                style="width: 135px"
              ></el-date-picker>
            </el-form-item>
            <el-form-item label="审核员 ">
              <el-select
                style="width: 280px"
                v-model="filterQuery.checkerName"
                placeholder="选择审核员"
                filterable
                clearable
              >
                <el-option
                  v-for="item in supervisors"
                  :key="item.name"
                  :label="item.name"
                  :value="item.name"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="问题状态">
              <el-select
                style="width: 280px"
                v-model="filterQuery.recordStatus"
                placeholder="选择状态"
                clearable
              >
                <el-option
                  v-for="item in status"
                  :key="item.id"
                  :label="item.name"
                  :value="item.name"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="审核轮次">
              <el-input
                placeholder="输入轮次"
                v-model="filterQuery.round"
                style="width: 280px"
              ></el-input>
            </el-form-item>
            <el-form-item label="分类">
              <el-select
                style="width: 280px"
                v-model="filterQuery.classify"
                placeholder="选择类型"
                clearable
              >
                <el-option
                  v-for="item in types"
                  :key="item.id"
                  :label="item.name"
                  :value="item.name"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <!-- <el-form-item label="问题状况" v-if=" userCode!=='2009'"> -->
            <el-form-item label="问题级别">
              <el-select
                style="width: 280px"
                v-model="filterQuery.questionLevel"
                placeholder="选择级别"
                clearable
              >
                <el-option
                  v-for="item in ranks"
                  :key="item.id"
                  :label="item.name"
                  :value="item.name"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="原因分析">
              <el-select
                style="width: 280px"
                v-model="filterQuery.causeAnalysis"
                placeholder="选择原因"
                clearable
              >
                <el-option
                  v-for="item in problemSources"
                  :key="item.id"
                  :label="item.name"
                  :value="item.name"
                ></el-option>
              </el-select>
            </el-form-item>
            <!--el-form-item label="岗位工龄" v-if=" userCode!=='2009'">
              <el-select style="width:280px" v-model="filterQuery.workingAge" placeholder="选择工龄" clearable>
              <el-option v-for="item in ages" :key="item.id" :label="item.name" :value="item.name"></el-option>
              </el-select>
            </el-form-item-->
          </el-col>
        </el-row>

        <el-row>
          <el-col>
            <!-- <el-form-item label="违章人员" v-if="userCode !== '2009'">
              <el-select
                style="width: 280px"
                v-model="filterQuery.responsePersonID"
                placeholder="选择人员"
                filterable
                clearable
              >
                <el-option
                  v-for="item in employees"
                  :key="item.employeeID"
                  :label="item.name"
                  :value="item.employeeID"
                ></el-option>
              </el-select>
            </el-form-item> -->
            <!--el-form-item label="监督轮次" v-if=" userCode!=='2009'">
              <el-input placeholder="输入轮次" v-model="filterQuery.round" style="width:280px"></el-input>
            </el-form-item-->
            <!--el-form-item label="用工性质" v-if=" userCode!=='2009'">
              <el-select style="width:280px" v-model="filterQuery.employmentProperty" placeholder="选择性质" clearable>
              <el-option v-for="item in eproperties" :key="item.id" :label="item.name" :value="item.name"></el-option>
              </el-select>
            </el-form-item-->
            <!--el-form-item label="岗位" v-if=" userCode!=='2009'">
              <el-select style="width:280px" v-model="filterQuery.workingName" placeholder="选择岗位" clearable>
              <el-option v-for="item in names" :key="item.id" :label="item.name" :value="item.name"></el-option>
              </el-select>
            </el-form-item-->
            <!--el-form-item label="问题状态" v-if=" userCode!=='2009'">
              <el-select style="width:280px" v-model="filterQuery.problemStatus" placeholder="选择问题状态" clearable>
                <el-option v-for="item in problemStatus" :key="item.id" :label="item.name" :value="item.name"></el-option>
              </el-select>
            </el-form-item-->
          </el-col>
        </el-row>

        <el-row>
          <el-col>
            <el-form-item label="审核主题">
              <el-select
                style="width: 280px"
                v-model="filterQuery.auditSubject"
                placeholder="选择主题"
                filterable
                clearable
              >
                <el-option
                  v-for="item in subjects"
                  :key="item.hseAuditSystemCode"
                  :label="item.evalueItem"
                  :value="item.evalueItem"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="隐患级别">
              <el-select
                style="width: 280px"
                v-model="filterQuery.problemLevel"
                placeholder="选择问题性质"
                filterable
                clearable
              >
                <el-option
                  v-for="item in problemLevel"
                  :key="item.id"
                  :label="item.name"
                  :value="item.name"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col>
            <!-- <el-form-item label="问题状况" v-if=" userCode!=='2009'"> -->
            <el-form-item label="QHSEE管理体系要素">
              <el-select
                style="width: 280px"
                v-model="filterQuery.qsheeManagementFactor"
                placeholder="选择要素"
                clearable
              >
                <el-option
                  v-for="item in factors"
                  :key="item.id"
                  :label="item.name"
                  :value="item.name"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="涉及要素">
              <el-select
                style="width: 280px"
                v-model="filterQuery.elementsInvolved"
                placeholder="选择要素"
                clearable
              >
                <el-option
                  v-for="item in elements"
                  :key="item"
                  :label="item"
                  :value="item"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col>
            <el-form-item>
              <el-button
                type="primary"
                native-type="submit"
                icon="el-icon-search"
                @click="query"
                >查询</el-button
              >
            </el-form-item>
            <el-form-item>
              <el-button
                style="background-color: #3399cc; color: #ffffff; width: 100%"
                @click="export2Excel"
                >导出Excel</el-button
              >
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>

      <el-table
        :data="tableList"
        v-loading="loading"
        border
        @row-click="clickTable"
        :header-cell-style="{ 'text-align': 'center' }"
        :cell-style="{ 'text-align': 'center' }"
        max-width="120px"
        style="width: 100%"
      >
        <el-table-column type="expand" width="40px">
          <template slot-scope="props">
            <el-form
              label-position="left"
              inline
              class="demo-table-expand"
              label-width="120px"
            >
              <el-breadcrumb separ ator="/">
                <el-breadcrumb-item :to="{ path: 'index' }"
                  >问题列表</el-breadcrumb-item
                >
                <el-breadcrumb-item>验证详情</el-breadcrumb-item>
              </el-breadcrumb>

              <el-row>
                <el-col :span="12">
                  <el-form-item label="检查人：">{{
                    props.row.responsePersonName
                  }}</el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="受检二级单位：">{{
                    props.row.parentCompanyName
                  }}</el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="受检基层单位：">{{
                    props.row.basicCompanyName
                  }}</el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="作业队号：">{{
                    props.row.operationTeamName
                  }}</el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="轮次：">{{
                    props.row.round
                  }}</el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="审核时间：">{{
                    props.row.audiTtime
                  }}</el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="审核主题：">{{
                    props.row.auditSubject
                  }}</el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="审核项：">{{
                    props.row.auditItem
                  }}</el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="24">
                  <el-form-item label="审核内容：">{{
                    props.row.auditContent
                  }}</el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="24">
                  <el-form-item label="判定依据:">{{
                    props.row.judgmentBasis
                  }}</el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="问题级别：">{{
                    props.row.questionLevel
                  }}</el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="原因分析：">{{
                    props.row.causeAnalysis
                  }}</el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="12">
                  <el-form-item label="隐患级别：">{{
                    props.row.problemLevel
                  }}</el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="审核类别：">{{
                    props.row.classify
                  }}</el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="整改建议：">{{
                    props.row.rectificationSuggestions
                  }}</el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="责任人：">{{
                    props.row.responsePersonName
                  }}</el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="整改责任人：">{{
                    props.row.rectPersonName
                  }}</el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="扣分：">{{
                    props.row.lostScore
                  }}</el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="12">
                  <el-form-item label="检查图片1： ">
                    <el-card
                      :body-style="{ padding: '10px' }"
                      style="height: 251px; width: 300px"
                    >
                      <el-popover placement="right" title="" trigger="click">
                        <div style="max-width: 600px; height: auto">
                          <img
                            :src="props.row.checkAttach1"
                            style="max-width: 400px; height: auto"
                          />
                        </div>
                        <img
                          slot="reference"
                          :src="props.row.checkAttach1"
                          :alt="props.row.checkAttach1"
                          style="max-height: 200px"
                        />
                      </el-popover>
                    </el-card>
                  </el-form-item>
                </el-col>

                <el-col :span="12">
                  <el-form-item label="检查图片2： ">
                    <el-card
                      :body-style="{ padding: '10px' }"
                      style="height: 251px; width: 300px"
                    >
                      <el-popover placement="right" title="" trigger="click">
                        <div style="max-width: 600px; height: auto">
                          <img
                            :src="props.row.checkAttach2"
                            style="max-width: 600px; height: auto"
                          />
                        </div>
                        <img
                          slot="reference"
                          :src="props.row.checkAttach2"
                          :alt="props.row.checkAttach2"
                          style="max-height: 200px"
                        />
                      </el-popover>
                    </el-card>
                  </el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="12">
                  <el-form-item label="检查图片3： ">
                    <el-card
                      :body-style="{ padding: '10px' }"
                      style="height: 251px; width: 300px"
                    >
                      <el-popover placement="right" title="" trigger="click">
                        <div style="max-width: 600px; height: auto">
                          <img
                            :src="props.row.checkAttach3"
                            style="max-width: 600px; height: auto"
                          />
                        </div>
                        <img
                          slot="reference"
                          :src="props.row.checkAttach3"
                          :alt="props.row.checkAttach3"
                          style="max-height: 200px"
                        />
                      </el-popover>
                    </el-card>
                  </el-form-item>
                </el-col>

                <el-col :span="12">
                  <el-form-item label="检查图片4： ">
                    <el-card
                      :body-style="{ padding: '10px' }"
                      style="height: 251px; width: 300px"
                    >
                      <el-popover placement="right" title="" trigger="click">
                        <div style="max-width: 600px; height: auto">
                          <img
                            :src="props.row.checkAttach4"
                            style="max-width: 600px; height: auto"
                          />
                        </div>
                        <img
                          slot="reference"
                          :src="props.row.checkAttach4"
                          :alt="props.row.checkAttach4"
                          style="max-height: 200px"
                        />
                      </el-popover>
                    </el-card>
                  </el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="12">
                  <el-form-item label="检查视频： ">
                    <el-card
                      :body-style="{ padding: '10px' }"
                      style="width: 300px; height: 240px"
                      v-if="props.row.checkVideo !== ''"
                    >
                      <video width="100%" height="220px" controls>
                        <source :src="props.row.checkVideo" type="video/mp4" />
                      </video>
                    </el-card>
                    <el-row style="height: 20px"></el-row>
                  </el-form-item>
                </el-col>
              </el-row>

              <el-row class="tableTitle">
                <span class="midText">整改内容</span>
              </el-row>
              <!-- <div class="tableTitle"><span class="midText">整改内容</span></div> -->
              <el-row style="height: 20px"></el-row>
              <el-row style="padding-bottom: 5px">
                <font style="font-size: 15px; font-weight: bold">问题整改</font>
              </el-row>
              <!-- <div v-for="(itemy,i) in props.row.children" :key="i" id="recDiv" >
            
          <div v-if="itemy.rectDate!==''">
          <div style="height:30px"></div>
          <hr/>
          <div style="height:20px"></div>
           <el-row >
             <el-col :span="7">
           <el-form-item label="整改时间:" id="rda">{{ itemy.rectDate }}</el-form-item>
           </el-col>
             <el-col :span="17">
           <el-form-item label="整改效果:">{{ itemy.rectEffect }}</el-form-item>
           </el-col>
          </el-row>
          
          <el-row>
            <el-col :span="7">
            <el-form-item label="整改责任人：" >{{ itemy.supervisorName }}</el-form-item>
          </el-col>
          <el-col :span="17" >
           <el-form-item label="整改描述:">{{ itemy.rectDescription }}</el-form-item>
           </el-col>
           </el-row>

           <el-row>
          <el-col :span="24" >
           <el-form-item label="整改文档:"><a :href="itemy.rectFile" target="_blank" rel="noopener noreferrer">{{ itemy.rectFile }}</a></el-form-item>
           </el-col>
           </el-row>

          
           <el-form-item label="整改附件："></el-form-item>
                <el-row >
                <el-col :span="2">
                  <el-card :body-style="{ padding: '10px' }" style="width:90%;height:240px" v-if="itemy.rectAttach1 !==''">
                  <el-popover placement="right" title="" trigger="click">
                    <div style="max-width:600px;height:auto"><img :src="itemy.rectAttach1" style="max-width:600px;height:auto"/></div>
                    <img slot="reference" :src="itemy.rectAttach1" :alt="itemy.rectAttach1" style="max-height: 240px">
                  </el-popover><br/>
                </el-card>
                </el-col>
                <el-col :span="2">
                    <el-card :body-style="{ padding: '10px' }" style="width:90%;height:240px" v-if="itemy.rectAttach2 !==''">
                  <el-popover placement="right" title="" trigger="click">
                    <div style="max-width:600px;height:auto"><img :src="itemy.rectAttach2" style="max-width:600px;height:auto"/></div>
                    <img slot="reference" :src="itemy.rectAttach2" :alt="itemy.rectAttach2" style="max-height: 240px">
                  </el-popover><br/>
                </el-card>
                </el-col>
                <el-col :span="2">
                   <el-card :body-style="{ padding: '10px' }" style="width:90%;height:240px" v-if="itemy.rectAttach3 !==''">
                  <el-popover placement="right" title="" trigger="click">
                    <div style="max-width:600px;height:auto"><img :src="itemy.rectAttach3" style="max-width:600px;height:auto"/></div>
                    <img slot="reference" :src="itemy.rectAttach3" :alt="itemy.rectAttach3" style="max-height: 240px">
                  </el-popover><br/>
                </el-card>
                </el-col>
                <el-col :span="2">
                   <el-card :body-style="{ padding: '10px' }" style="width:90%;height:240px" v-if="itemy.rectAttach4 !==''">
                  <el-popover placement="right" title="" trigger="click">
                    <div style="max-width:600px;height:auto"><img :src="itemy.rectAttach4" style="max-width:600px;height:auto"/></div>
                    <img slot="reference" :src="itemy.rectAttach4" :alt="itemy.rectAttach4" style="max-height: 240px">
                  </el-popover><br/>
                </el-card>
                </el-col>
                <el-col :span="2">
                  <el-card :body-style="{ padding: '10px' }" style="width:90%;height:240px" v-if="itemy.rectVideo !==''">
                   <video width="100%" height="230" controls>
                  <source :src="itemy.rectVideo" type="video/mp4">
                </video>
                </el-card>
                </el-col>
              </el-row>
              </div> 
               </div>  -->
              <div
                v-for="(itemy, i) in props.row.children"
                :key="itemy"
                id="qHSEERectRecordID"
              >
                <!-- <el-divider v-if="i !== 0"></el-divider> -->
                <div class="tableTitle" v-if="i !== 0">
                  <span class="midText"></span>
                </div>
                <el-row style="height: 20px"></el-row>
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="整改时间：">{{
                      props.row.rectDate
                    }}</el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="整改效果：">{{
                      props.row.rectEffect
                    }}</el-form-item>
                  </el-col>
                </el-row>

                <el-row>
                  <el-col :span="12">
                    <el-form-item label="整改责任人：">{{
                      itemy.supervisorName
                    }}</el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="整改描述：">{{
                      itemy.rectDescription
                    }}</el-form-item>
                  </el-col>
                </el-row>

                <el-col>
                  <el-form-item label="相关文件：">
                    <!-- <el-tooltip
                      class="item"
                      effect="dark"
                      content="点击获取整改文件"
                      placement="rig
                  ht-start"
                    > -->
                    <a
                      :href="itemy.rectFile"
                      target="_blank"
                      rel="noopener noreferrer"
                    >
                      <i class="el-icon-document" style="font-size: 20px"></i>
                      {{ itemy.rectFile }}
                    </a>
                    <!-- </el-tooltip> -->
                  </el-form-item>
                </el-col>

                <el-row>
                  <el-col :span="12">
                    <el-form-item label="整改图片1： ">
                      <el-card
                        :body-style="{ padding: '10px' }"
                        style="height: 251px; width: 300px"
                      >
                        <el-popover placement="right" title="" trigger="click">
                          <div style="max-width: 600px; height: auto">
                            <img
                              :src="itemy.rectAttach1"
                              style="max-width: 400px; height: auto"
                            />
                          </div>
                          <img
                            slot="reference"
                            :src="itemy.rectAttach1"
                            :alt="itemy.rectAttach1"
                            style="max-height: 200px"
                          />
                        </el-popover>
                      </el-card>
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="整改图片2： ">
                      <el-card
                        :body-style="{ padding: '10px' }"
                        style="height: 251px; width: 300px"
                      >
                        <el-popover placement="right" title="" trigger="click">
                          <div style="max-width: 600px; height: auto">
                            <img
                              :src="itemy.rectAttach2"
                              style="max-width: 600px; height: auto"
                            />
                          </div>
                          <img
                            slot="reference"
                            :src="itemy.rectAttach2"
                            :alt="itemy.rectAttach2"
                            style="max-height: 200px"
                          />
                        </el-popover>
                      </el-card>
                    </el-form-item>
                  </el-col>
                </el-row>

                <el-row>
                  <el-col :span="12">
                    <el-form-item label="整改图片3： ">
                      <el-card
                        :body-style="{ padding: '10px' }"
                        style="height: 251px; width: 300px"
                      >
                        <el-popover placement="right" title="" trigger="click">
                          <div style="max-width: 600px; height: auto">
                            <img
                              :src="itemy.rectAttach3"
                              style="max-width: 600px; height: auto"
                            />
                          </div>
                          <img
                            slot="reference"
                            :src="itemy.rectAttach3"
                            :alt="itemy.rectAttach3"
                            style="max-height: 200px"
                          />
                        </el-popover>
                      </el-card>
                    </el-form-item>
                  </el-col>

                  <el-col :span="12">
                    <el-form-item label="整改图片4： ">
                      <el-card
                        :body-style="{ padding: '10px' }"
                        style="height: 251px; width: 300px"
                      >
                        <el-popover placement="right" title="" trigger="click">
                          <div style="max-width: 600px; height: auto">
                            <img
                              :src="itemy.rectAttach4"
                              style="max-width: 600px; height: auto"
                            />
                          </div>
                          <img
                            slot="reference"
                            :src="itemy.rectAttach4"
                            :alt="itemy.rectAttach4"
                            style="max-height: 200px"
                          />
                        </el-popover>
                      </el-card>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="整改视频： ">
                      <el-card
                        :body-style="{ padding: '10px' }"
                        style="width: 300px; height: 240px"
                      >
                        <video width="100%" height="220px" controls>
                          <source :src="itemy.rectVideo" type="video/mp4" />
                        </video>
                      </el-card>
                      <el-row style="height: 20px"></el-row>
                    </el-form-item>
                  </el-col>
                </el-row>
              </div>
              <el-row class="tableTitle">
                <span class="midText">验证内容</span>
              </el-row>
              <el-row style="height: 20px"></el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="验证人：">{{
                    props.row.verifyPersonName
                  }}</el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="验证时间：">{{
                    props.row.verifyDate
                  }}</el-form-item>
                </el-col>
              </el-row>
            </el-form>
          </template>
        </el-table-column>

        <el-table-column label="序号" width="40px">
          <template slot-scope="scope">
            <font>{{ scope.$index + 1 }}</font>
          </template>
        </el-table-column>
        <el-table-column label="审核时间" prop="audittime" width="100px">
        </el-table-column>
        <el-table-column
          label="轮次"
          prop="round"
          width="80px"
        ></el-table-column>
        <el-table-column
          label="状态"
          prop="recordStatus"
          width="80px"
        ></el-table-column>
        <el-table-column
          label="组名"
          prop="auditGroupName"
          width="80px"
        ></el-table-column>
        <!-- <el-table-column 
      label="审核地点"
      align="center"
       width="280px">-->
        <el-table-column
          label="机关处室/二级单位"
          prop="parentCompanyName"
          :show-overflow-tooltip="true"
          width="100px"
        >
        </el-table-column>
        <el-table-column
          label="科室/基层单位"
          prop="basicCompanyName"
          :show-overflow-tooltip="true"
          width="100px"
        >
        </el-table-column>
        <el-table-column
          label="作业队号(集团和公司队号）"
          prop="operationTeamName"
          :show-overflow-tooltip="true"
          width="100px"
        >
        </el-table-column>
        <!-- </el-table-column> -->
        <!-- <el-table-column
          label="问题描述"
          prop="audDescription"
          :show-overflow-tooltip="true"
          width="120px"
        >
        </el-table-column> -->
        <!-- <el-table-column
          label="判定依据"
          prop="judgmentBasis"
          :show-overflow-tooltip="true"
          width="200px"
        >
        </el-table-column> -->
        <el-table-column
          label="QHSEE管理体系要素"
          prop="qHSEEManagementFactor"
          :show-overflow-tooltip="true"
          width="100px"
        >
        </el-table-column>
        <el-table-column
          label="涉及要素"
          prop="elementsInvolved"
          :show-overflow-tooltip="true"
          width="100px"
        >
        </el-table-column>
        <el-table-column
          label="审核主题"
          prop="auditSubject"
          :show-overflow-tooltip="true"
          width="120px"
        >
        </el-table-column>
        <!-- <el-table-column
          label="审核项"
          :show-overflow-tooltip="true"
          width="180px"
        >
        <template slot-scope="scope">
          <font>{{scope.row.auditItem}}</font>
        </template>
        </el-table-column> -->

        <el-table-column
          label="问题性质（级别）"
          prop="questionLevel"
          :show-overflow-tooltip="true"
          width="80px"
        >
        </el-table-column>
        <el-table-column
          label="原因分析"
          prop="causeAnalysis"
          :show-overflow-tooltip="true"
          width="100px"
        >
        </el-table-column>
        <el-table-column
          label="隐患级别"
          prop="problemLevel"
          :show-overflow-tooltip="true"
          width="80px"
        >
        </el-table-column>
        <!-- <el-table-column
          label="整改建议（含时间）"
          prop="rectificationSuggestions"
          :show-overflow-tooltip="true"
          width="120px"
        >
        </el-table-column> -->
        <el-table-column
          label="分类"
          prop="classify"
          :show-overflow-tooltip="true"
          width="80px"
        >
        </el-table-column>

        <!--el-table-column label="操作" align="center" header-align="center" width="90px">
        <template slot-scope="scope">

            <&nbsp;&nbsp;&nbsp; 
            <el-button size="mini" type="danger" icon="el-icon-delete" @click="handleDelete(scope.row)">删除</el-button>
            &nbsp;&nbsp;
            <el-button v-if="scope.row.status=='未整改'" size="medium" @click="editProblem(scope.row,'editProblem')"  type="primary"> <i class="el-icon-edit"></i>修改</el-button> 
            <el-row>
                 <el-col>
                <el-button size="mini" type="danger" icon="el-icon-delete" @click="handleDelete(scope.row)">删除</el-button>
              </el-col>
            </el-row>
            &nbsp;&nbsp;&nbsp;
            
            
            <el-row>
              <el-col>
                <el-button v-if="scope.row.status=='未整改'||scope.row.status=='未审核'" size="mini" @click="editProblem(scope.row,'editProblem')"  type="primary"> <i class="el-icon-edit"></i>修改</el-button>
              </el-col>
            </el-row>
        </template>
    </el-table-column>-->
      </el-table>

      <!-- <service-dialog
        v-if="userCode === '2007'"
        :show.sync="showDialog"
        :add-data="dataToDialog"
        @cancelDialog="cancelDialog"
        @queryListS="queryListQ"
        @submitDialog="submitDialog"
      ></service-dialog> -->

      <!-- <el-table
        :data="tableData"
        v-loading="loading"
        border
        @row-click="clickTable"
        ref="refTable"
        style="width: 1600px"
        v-if="userCode !== '2007'"
        height="500"
        max-height="500"
      > -->
      <!-- <el-table-column type="expand">
          <template slot-scope="props">
            <el-form
              label-position="left"
              inline
              class="demo-table-expand"
              label-width="140px"
            >
              <el-row>
                <el-col :span="7">
                  <el-form-item label="受检单位：">{{
                    props.row.parentCompanyName
                  }}</el-form-item>
                </el-col>
                <el-col :span="7">
                  <el-form-item label="受检基层单位：">{{
                    props.row.basicCompanyName
                  }}</el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="7">
                  <el-form-item label="检查时间：">{{
                    props.row.checkDate
                  }}</el-form-item>
                </el-col>
                <el-col :span="17">
                  <el-form-item label="受检三级单位">{{
                    props.row.companyName
                  }}</el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="7">
                  <el-form-item label="检查地点：">{{
                    props.row.checkStation
                  }}</el-form-item>
                </el-col>
                <el-col :span="17">
                  <el-form-item label="检查项目：">{{
                    props.row.checkItem
                  }}</el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="17">
                  <el-form-item label="检查表：">{{
                    props.row.checkListName
                  }}</el-form-item>
                </el-col>
              </el-row>

              <el-row :span="24">
                <el-col :span="24">
                  <el-form-item label="检查项：">{{
                    props.row.checkListItemName
                  }}</el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="24">
                  <el-form-item label="问题描述：">{{
                    props.row.description
                  }}</el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="7">
                  <el-form-item label="扣分:">{{
                    props.row.lostScore
                  }}</el-form-item>
                </el-col>
                <el-col :span="17">
                  <el-form-item label="问题原因：">{{
                    props.row.problemSource
                  }}</el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="依据标准：">{{
                    props.row.problemGist
                  }}</el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="问题体系要素：">{{
                    props.row.hseFactor
                  }}</el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="7">
                  <el-form-item label="问题程度：">{{
                    props.row.problemRank
                  }}</el-form-item>
                </el-col>
                <el-col :span="17">
                  <el-form-item label="问题类型：">{{
                    props.row.problemType
                  }}</el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="7">
                  <el-form-item label="责任人：">{{
                    props.row.responsePersonName
                  }}</el-form-item>
                </el-col>
                <el-col :span="17">
                  <el-form-item label="岗位名称：">{{
                    props.row.workingName
                  }}</el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="7">
                  <el-form-item label="用工性质：">{{
                    props.row.employmentProperty
                  }}</el-form-item>
                </el-col>
                <el-col :span="17">
                  <el-form-item label="岗位工龄：">{{
                    props.row.workingAge
                  }}</el-form-item>
                </el-col>
              </el-row>

              <el-row>
                <el-col :span="24">
                  <el-form-item label="整改责任人：">{{
                    props.row.supervisorName
                  }}</el-form-item>
                </el-col>
              </el-row>

              <el-form-item label="问题附件："></el-form-item>
              <el-row>
                <el-col :span="2">
                  <el-card
                    :body-style="{ padding: '10px' }"
                    style="width: 90%; height: 240px"
                    v-if="props.row.checkAttach1 !== ''"
                  >
                    <el-popover placement="right" title="" trigger="click">
                      <div style="max-width: 600px; height: auto">
                        <img
                          :src="props.row.checkAttach1"
                          style="max-width: 600px; height: auto"
                        />
                      </div>
                      <img
                        slot="reference"
                        :src="props.row.checkAttach1"
                        :alt="props.row.checkAttach1"
                        style="max-height: 240px"
                      /> </el-popover
                    ><br />
                  </el-card>
                </el-col>
                <el-col :span="2">
                  <el-card
                    :body-style="{ padding: '10px' }"
                    style="width: 90%; height: 240px"
                    v-if="props.row.checkAttach2 !== ''"
                  >
                    <el-popover placement="right" title="" trigger="click">
                      <div style="max-width: 600px; height: auto">
                        <img
                          :src="props.row.checkAttach2"
                          style="max-width: 600px; height: auto"
                        />
                      </div>
                      <img
                        slot="reference"
                        :src="props.row.checkAttach2"
                        :alt="props.row.checkAttach2"
                        style="max-height: 240px"
                      /> </el-popover
                    ><br />
                  </el-card>
                </el-col>
                <el-col :span="2">
                  <el-card
                    :body-style="{ padding: '10px' }"
                    style="width: 90%; height: 240px"
                    v-if="props.row.checkAttach3 !== ''"
                  >
                    <el-popover placement="right" title="" trigger="click">
                      <div style="max-width: 600px; height: auto">
                        <img
                          :src="props.row.checkAttach3"
                          style="max-width: 600px; height: auto"
                        />
                      </div>
                      <img
                        slot="reference"
                        :src="props.row.checkAttach3"
                        :alt="props.row.checkAttach3"
                        style="max-height: 240px"
                      /> </el-popover
                    ><br />
                  </el-card>
                </el-col>
                <el-col :span="2">
                  <el-card
                    :body-style="{ padding: '10px' }"
                    style="width: 90%; height: 240px"
                    v-if="props.row.checkAttach4 !== ''"
                  >
                    <el-popover placement="right" title="" trigger="click">
                      <div style="max-width: 600px; height: auto">
                        <img
                          :src="props.row.checkAttach4"
                          style="max-width: 600px; height: auto"
                        />
                      </div>
                      <img
                        slot="reference"
                        :src="props.row.checkAttach4"
                        :alt="props.row.checkAttach4"
                        style="max-height: 240px"
                      /> </el-popover
                    ><br />
                  </el-card>
                </el-col>
                <el-col :span="2">
                  <el-card
                    :body-style="{ padding: '10px' }"
                    style="width: 90%; height: 240px"
                    v-if="props.row.checkVideo !== ''"
                  >
                    <video width="100%" height="230" controls>
                      <source :src="props.row.checkVideo" type="video/mp4" />
                    </video>
                  </el-card>
                </el-col>
              </el-row>

              <div
                v-for="(itemy, i) in props.row.children"
                :key="i"
                id="recDiv"
              >
                <div v-if="itemy.rectDate !== ''">
                  <div style="height: 30px"></div>
                  <hr />
                  <div style="height: 20px"></div>
                  <el-row>
                    <el-col :span="7">
                      <el-form-item label="整改时间:" id="rda">{{
                        itemy.rectDate
                      }}</el-form-item>
                    </el-col>
                    <el-col :span="17">
                      <el-form-item label="整改效果:">{{
                        itemy.rectEffect
                      }}</el-form-item>
                    </el-col>
                  </el-row>

                  <el-row>
                    <el-col :span="7">
                      <el-form-item label="整改责任人：">{{
                        itemy.supervisorName
                      }}</el-form-item>
                    </el-col>
                    <el-col :span="17">
                      <el-form-item label="整改描述:">{{
                        itemy.rectDescription
                      }}</el-form-item>
                    </el-col>
                  </el-row>

                  <el-row>
                    <el-col :span="24">
                      <el-form-item label="整改文档:"
                        ><a
                          :href="itemy.rectFile"
                          target="_blank"
                          rel="noopener noreferrer"
                          >{{ itemy.rectFile }}</a
                        ></el-form-item
                      >
                    </el-col>
                  </el-row>

                  <el-form-item label="整改附件："></el-form-item>
                  <el-row>
                    <el-col :span="2">
                      <el-card
                        :body-style="{ padding: '10px' }"
                        style="width: 90%; height: 240px"
                        v-if="itemy.rectAttach1 !== ''"
                      >
                        <el-popover placement="right" title="" trigger="click">
                          <div style="max-width: 600px; height: auto">
                            <img
                              :src="itemy.rectAttach1"
                              style="max-width: 600px; height: auto"
                            />
                          </div>
                          <img
                            slot="reference"
                            :src="itemy.rectAttach1"
                            :alt="itemy.rectAttach1"
                            style="max-height: 240px"
                          /> </el-popover
                        ><br />
                      </el-card>
                    </el-col>
                    <el-col :span="2">
                      <el-card
                        :body-style="{ padding: '10px' }"
                        style="width: 90%; height: 240px"
                        v-if="itemy.rectAttach2 !== ''"
                      >
                        <el-popover placement="right" title="" trigger="click">
                          <div style="max-width: 600px; height: auto">
                            <img
                              :src="itemy.rectAttach2"
                              style="max-width: 600px; height: auto"
                            />
                          </div>
                          <img
                            slot="reference"
                            :src="itemy.rectAttach2"
                            :alt="itemy.rectAttach2"
                            style="max-height: 240px"
                          /> </el-popover
                        ><br />
                      </el-card>
                    </el-col>
                    <el-col :span="2">
                      <el-card
                        :body-style="{ padding: '10px' }"
                        style="width: 90%; height: 240px"
                        v-if="itemy.rectAttach3 !== ''"
                      >
                        <el-popover placement="right" title="" trigger="click">
                          <div style="max-width: 600px; height: auto">
                            <img
                              :src="itemy.rectAttach3"
                              style="max-width: 600px; height: auto"
                            />
                          </div>
                          <img
                            slot="reference"
                            :src="itemy.rectAttach3"
                            :alt="itemy.rectAttach3"
                            style="max-height: 240px"
                          /> </el-popover
                        ><br />
                      </el-card>
                    </el-col>
                    <el-col :span="2">
                      <el-card
                        :body-style="{ padding: '10px' }"
                        style="width: 90%; height: 240px"
                        v-if="itemy.rectAttach4 !== ''"
                      >
                        <el-popover placement="right" title="" trigger="click">
                          <div style="max-width: 600px; height: auto">
                            <img
                              :src="itemy.rectAttach4"
                              style="max-width: 600px; height: auto"
                            />
                          </div>
                          <img
                            slot="reference"
                            :src="itemy.rectAttach4"
                            :alt="itemy.rectAttach4"
                            style="max-height: 240px"
                          /> </el-popover
                        ><br />
                      </el-card>
                    </el-col>
                    <el-col :span="2">
                      <el-card
                        :body-style="{ padding: '10px' }"
                        style="width: 90%; height: 240px"
                     
                      >
                      v-if="itemy.rectVideo !== ''"
                        <video width="100%" height="230" controls>
                          <source :src="itemy.rectVideo" type="video/mp4" />
                        </video>
                      </el-card>
                    </el-col>
                  </el-row>
                </div>
              </div>

              <el-row>
                <el-col :span="7">
                  <el-form-item label="验证人：">{{
                    props.row.verifyPersonName
                  }}</el-form-item>
                </el-col>
                <el-col :span="17">
                  <el-form-item label="验证时间：">{{
                    props.row.verifyDate
                  }}</el-form-item>
                </el-col>
              </el-row>
            </el-form>
          </template>
        </el-table-column> -->

      <!-- <el-table-column
          label="轮次"
          prop="round"
          header-align="center"
          width="60px"
        >
        </el-table-column>
        <el-table-column
          label="日期"
          prop="checkDate"
          header-align="center"
          width="100px"
        >
        </el-table-column> -->
      <!-- <el-table-column
          label="单位"
          prop="parentCompanyName"
          header-align="center"
          width="100px"
        >
        </el-table-column>
        <el-table-column
          label="基层单位"
          prop="basicCompanyName"
          header-align="center"
          width="100px"
        >
        </el-table-column> -->
      <!-- <el-table-column
          label="班组"
          prop="companyName"
          header-align="center"
          width="110px"
        >
        </el-table-column>
        <el-table-column
          label="检查地点"
          prop="checkStation"
          header-align="center" 
          width="80px"
        >
        </el-table-column> -->
      <!-- <el-table-column
          label="检查类型"
          prop="checkType"
          header-align="center"
          width="80px"
        >
        </el-table-column>
        <el-table-column
          label="问题类型"
          prop="problemType"
          header-align="center"
          width="150px"
        >
        </el-table-column> -->
      <!-- <el-table-column
          label="问题体系要素"
          prop="hseFactor"
          header-align="center"
          width="110px"
        >
        </el-table-column>
        <el-table-column
          label="问题原因"
          prop="problemSource"
          header-align="center"
          width="100px"
        >
        </el-table-column> -->
      <!-- <el-table-column label="问题描述" header-align="center" width="200px">
          <template slot-scope="scope">
            <span>{{ scope.row.description | ellipsis }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="整改责任人"
          prop="supervisorName"
          header-align="center"
          width="100px"
        >
        </el-table-column> -->
      <!-- <el-table-column>
        </el-table-column>
        <el-table-column
          label="问题程度"
          prop="problemRank"
          header-align="center"
          width="80px"
        >
        </el-table-column> -->
      <!-- <el-table-column
          label="违章人员"
          prop="responsePersonName"
          header-align="center"
          width="80px"
        >
        </el-table-column>
        <el-table-column
          label="岗位"
          prop="workingName"
          header-align="center"
          width="110px"
        >
        </el-table-column> -->
      <!-- <el-table-column
          label="岗位工作年限"
          prop="workingAge"
          header-align="center"
          width="110px"
        >
        </el-table-column>
        <el-table-column
          label="用工形式"
          prop="employmentProperty"
          header-align="center"
          width="80px"
        >
        </el-table-column> -->
      <!-- <el-table-column
          label="扣分"
          prop="lostScore"
          header-align="center"
          width="80px"
        >
        </el-table-column>
        <el-table-column
          label="问题状况"
          prop="status"
          header-align="center"
          width="80px"
        >
        </el-table-column> -->
      <!-- </el-table> -->

      <div class="pagination-base">
        <el-pagination
          @current-change="handlePageChange"
          :page-size="queryList.size"
          :total="allList"
          background
          layout="total, prev, pager, next, jumper"
        >
        </el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
import {
  GetDictionary,
  GetEmployee,
  GetSupervisor2,
  GetCommonUserCode,
} from "../../../services/cq_gettreedata";
import { DeleteProblem } from "../../../services/cq_gettreedata";
import { GetProblemList2 } from "../../../services/cq_gettreedata";
import Treeselect from "@riophae/vue-treeselect";
//import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import { GetCompany } from "../../../services/cq_gettreedata";
// import serviceDialog from "../../../views/cq_problem_management/problem_queries/detail_edit";
import {
  GetHSEAuditSystem,
  GetQHSEESystem,
} from "../../../services/hseAuditProblemList";

import { GethseGroupProblemList } from "../../../services/hseGroupProblemList";
import { GetQuery } from "../../../services/hseGroupProblemQuery";

const DefaultQuery = {
  //taskName: '',
  companyCode: null,
  checkDate1: "",
  checkDate2: "",
  // problemRepeat: '',
  round: "",
  checkStaffID: "",
  responsePersonID: "",
  problemType: "",
  problemRank: "",
  hseFactor: "",
  workingName: "",
  workingAge: "",
  // problemStatus:'',
  employmentProperty: "",
  problemSources: "",
  status: "",
  pageIdx: 0,
  pageSize: 10,
};
const DefaultQueryExcel = {
  //taskName: '',
  companyCode: null,
  checkDate1: "",
  checkDate2: "",
  round: "",
  checkStaffID: "",
  responsePersonID: "",
  problemSources: "",
  problemType: "",
  problemRank: "",
  hseFactor: "",
  workingName: "",
  workingAge: "",
  // problemStatus:'',
  employmentProperty: "",
  status: "",
  // pageIdx: 1,
  // pageSize: 10,
  type: "all",
};

export default {
  filters: {
    ellipsis(value) {
      if (!value) return "";
      if (value.length > 30) {
        return value.slice(0, 30) + "...";
      }
      return value;
    },
  },

  components: { Treeselect },

  data() {
    return {
      queryList: {
        // companyCode: '',
        // checkerName:'',
        // size: 1,
        // page: 10
        companyCode: "",
        startDate: "",
        endDate: "",
        recordStatus: "",
        checkerName: "",
        round: "",
        causeAnalysis: "",
        classify: "",
        auditSubject: "",
        qsheeManagementFactor: "",
        elementsInvolved: "",
        questionLevel: "",
        problemLevel: "",
        size: 10,
        page: 1,
      },
      allList: 0,
      size: 0,
      allPage_page: 0,
      tableList: [],
      // 分页
      allPage: {
        page: 1,
        size: 10,
      },
      allPage01: {
        page: 1,
        size: 10,
      },
      showDialog: false,
      dataToDialog: {},
      pid: 0,
      filterQuery: {
        problemLevel: "",
        companyCode: "",
        startDate: "",
        endDate: "",
        recordStatus: "",
        checkerName: "",
        round: "",
        causeAnalysis: "",
        classify: "",
        auditSubject: "",
        qsheeManagementFactor: "",
        elementsInvolved: "",
        questionLevel: "",
        num: 1,
        size: 10,
      },
      fitertask: {},
      taskAyy: "",
      taskNameList: [],
      taskNameList1: [],
      loading: false,
      tableData: [],
      timeout: null,
      dateRange: [],
      total: 0,
      options: [],
      types: [],
      employees: [],
      repeats: [],
      status: [],
      indexStartNum: 1,
      ranks: [],
      factors: [],
      rounds: [],
      supervisors: [],
      ages: [],
      names: [],
      eproperties: [],
      recHis: [],
      rectFile: [],
      problemSources: [],
      userCode: 0,
      elements: [],
      subjects: [],
      problemLevel: [],
      // singers: [],

      // filterQueryExcel: {}
    };
  },

  mounted() {
    //   表中查询所有数据
    this.GetAllGroupProblemList();
    this.getDictionaryData();
    // this.loadFilterParams();
    this.getUserCode();
    // this.gettaskName()
    this.handleGetListData();
    this.getDate();
    // this.getrepeats()
    //this.handleDelete()
    this.getRounds();
    this.getAges();
    this.getNames();
    this.getEproperties();
    this.getEmployees();
  },
  methods: {
    // 条件查询
    query() {
      console.log("filterQuery", this.filterQuery);
      this.queryList.companyCode = this.filterQuery.companyCode;
      this.queryList.startDate = this.filterQuery.startDate;
      this.queryList.endDate = this.filterQuery.endDate;
      this.queryList.recordStatus = this.filterQuery.recordStatus;
      this.queryList.checkerName = this.filterQuery.checkerName;
      this.queryList.round = this.filterQuery.round;
      this.queryList.causeAnalysis = this.filterQuery.causeAnalysis;
      this.queryList.classify = this.filterQuery.classify;
      this.queryList.auditSubject = this.filterQuery.auditSubject;
      this.queryList.qsheeManagementFactor = this.filterQuery.qsheeManagementFactor;
      this.queryList.elementsInvolved = this.filterQuery.elementsInvolved;
      this.queryList.questionLevel = this.filterQuery.questionLevel;
      this.queryList.problemLevel = this.filterQuery.problemLevel;
      console.log("queryList",this.queryList);
      this.queryList.page = 1
      this.queryList.size = 10
      GetQuery(this.queryList).then((res) => {
        console.log("条件查询", res);
        this.allList = res.data.total;
        this.queryList.page = res.data.page;
        console.log(this.queryList.page);
        this.tableList = res.data.list;
        console.log("tableList",this.tableList);
      });
      // if (
      //   this.filterQuery.checkerName != "" ||
      //   this.filterQuery.startDate != "" ||
      //   this.filterQuery.endDate != "" ||
      //   this.filterQuery.recordStatus != "" ||
      //   this.filterQuery.round != "" ||
      //   this.filterQuery.causeAnalysis != "" ||
      //   this.filterQuery.classify != "" ||
      //   this.filterQuery.auditSubject != "" ||
      //   this.filterQuery.qsheeManagementFactor != "" ||
      //   this.filterQuery.elementsInvolved != "" ||
      //   this.filterQuery.questionLevel != ""
      // ) {
      //   GetQuery(this.queryList).then((res) => {
      //     console.log("条件查询", res);
      //     this.allList = res.data.total;
      //     this.size = res.data.total;
      //     this.allPage = res.data.page;
      //     console.log(this.allPage);
      //     this.tableList = res.data.list;
      //   });
      // } else {
      //   // this.allPage.page = 1
      //   // this.allPage.size = 10
      //   console.log(this.allPage01);
      //   // GethseGroupProblemList(this.allPage01).then((res) => {
      //   //   this.tableList = res.data.list;
      //   //   this.allList = res.data.total;
      //   //   // console.log("分页", this.tableList);
      //   // });
      //   GetQuery(this.queryList).then((res) => {
      //     console.log("条件查询", res);
      //     this.allList = res.data.total;
      //     this.size = res.data.total;
      //     this.allPage.page = res.data.page;
      //     console.log(res.data.page);
      //     this.tableList = res.data.list;
      //   });
      // }
    },
    handlePageChange(page) {
      this.queryList.page = page;
      console.log(this.queryList.page);
      // GethseGroupProblemList(this.allPage).then((res) => {
      //   //   console.log("变化后",res);
      //   this.tableList = res.data.list;
      // });
      GetQuery(this.queryList).then((res) => {
        console.log("条件查询", res);
        this.allList = res.data.total;
        this.size = res.data.total;
        this.queryList.page = res.data.page;
        console.log(this.allPage);
        this.tableList = res.data.list;
      });
    },
    //   查询表中所有数据
    GetAllGroupProblemList() {
      console.log(this.allPage);
      GethseGroupProblemList(this.allPage).then((res) => {
        this.tableList = res.data.list;
        this.allList = res.data.total;
        // console.log("分页", this.allList);
      });
    },
    getDictionaryData() {
      //获取监督员
      GetSupervisor2()
        .then((res) => {
          this.supervisors = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
      //问题状态
      GetDictionary({ name: "QHSEE问题状态" })
        .then((res) => {
          this.status = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
      //问题级别
      GetDictionary({ name: "QHSEE问题级别" })
        .then((res) => {
          this.ranks = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
      //原因分析
      GetDictionary({ name: "QHSEE原因分析" })
        .then((res) => {
          this.problemSources = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
      //分类
      GetDictionary({ name: "QHSEE问题分类" })
        .then((res) => {
          this.types = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
      //审核主题
      GetDictionary({ name: "QHSEE管理体系要素" })
        .then((res) => {
          this.factors = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
      //审核主题
      GetHSEAuditSystem()
        .then((res) => {
          this.subjects = res.data;
        })
        .catch((err) => {
          this.$message.error(err);
        });
      //涉及要素
      GetQHSEESystem()
        .then((res) => {
          res.data.map((item) => {
            if (item !== "" && item !== null) {
              this.elements.push(item);
            }
          });
        })
        .catch((err) => {
          this.$message.error(err);
        });
      GetDictionary({ name: "QHSEE隐患级别" })
        .then((res) => {
          this.problemLevel = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
    },

    queryListQ() {
      this.handleSearch();
    },
    cancelDialog(val) {
      this.dataToDialog = {};
      this.showDialog = val;
    },
    submitDialog(val) {
      this.dataToDialog = {};
      this.showDialog = val;
    },

    getDialogVdateReffect() {
      let date = new Date();
      let month =
        date.getMonth() < 9 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
      let day = date.getDate() <= 9 ? "0" + date.getDate() : date.getDate();
      this.dataToDialog.verifyDate =
        date.getFullYear() + "-" + month + "-" + day;
      this.dataToDialog.rectEffect = "合格";
    },
    editProblem(row, method) {
      this.dataToDialog = row;
      this.dataToDialog.method = method;
      this.dataToDialog.checkCompanyList = new Object(
        this.dealCompanyCode(row.companyCode)
      );
      if (this.dataToDialog.immediately == "否") this.getDialogVdateReffect();
      this.showDialog = true;
      //console.log(this.dataToDialog);
    },
    dealCompanyCode(companyCode) {
      let checkCompanyList = [];
      let i = 0;
      while (i < companyCode.length) {
        checkCompanyList.push(companyCode.slice(0, i + 2));
        i = i + 2;
      }
      return checkCompanyList;
    },

    getUserCode() {
      GetCommonUserCode()
        .then((res) => {
          this.userCode = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
    },

    handleGetRechistory(res) {
      // debugger
      for (var i = 0; i < res.data.list.length; i++) {
        this.recHis[res.data.list[i].checkRecordID] = [];
        for (var j = 0; j < res.data.list.length; j++) {
          if (
            res.data.list[i].checkRecordID === res.data.list[j].checkRecordID
          ) {
            this.recHis[res.data.list[i].checkRecordID].push(res.data.list[j]);
          }
        }
      }
    },

    handleRecfile(res) {
      for (var i = 0; i < res.data.list.length; i++) {
        for (var j = 0; j < res.data.list[i].children.length; j++) {
          if (
            res.data.list[i].children[j].rectFile == null ||
            res.data.list[i].children[j].rectFile == undefined ||
            res.data.list[i].children[j].rectFile == ""
          ) {
            res.data.list[i].children[j].rectFile = "#";
          }
        }
      }
    },

    getEmployees() {
      GetEmployee({ type: "all" })
        .then((res) => {
          this.employees = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
    },

    getRounds() {
      GetDictionary({ name: "监督轮次" })
        .then((res) => {
          this.rounds = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
    },

    getAges() {
      GetDictionary({ name: "岗位工龄" })
        .then((res) => {
          this.ages = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
    },

    getNames() {
      GetDictionary({ name: "岗位" })
        .then((res) => {
          this.names = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
    },
    getEproperties() {
      GetDictionary({ name: "员工组" })
        .then((res) => {
          this.eproperties = res.data;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
    },
    getDate() {
      GetCompany()
        .then((res) => {
          this.options = res.data;
          this.filterQuery.companyCode = res.data[0].id;
          // console.log(res.data);
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
    },
    handleDelete(item) {
      this.$confirm("此操作将永久删除该条记录, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          DeleteProblem(item.id).then(
            () => {
              this.handleGetListData();
            },
            (err) => {
              this.$message.error(err.message);
            }
          );
        })
        .catch(() => {});
    },
    export2Excel() {
      this.queryList.size = 1073741824
      this.queryList.page = 0
      this.filterQueryExcel = { ...DefaultQueryExcel, ...this.$route.query };
      this.filterQueryExcel = {
        ...this.filterQueryExcel,
      };
      this.filterQueryExcel = JSON.parse(JSON.stringify(this.queryList));
      this.filterQueryExcel.size = Math.pow(2, 30);
      this.filterQueryExcel.num = 0;
      this.excelData = GetQuery(this.queryList).then((res) => {
        this.excelData = res.data;
        console.log("Excel",res.data);
        this.loading = false;
        require.ensure([], () => {
          const {
            export_json_to_excel,
          } = require("../../../vendor/Export2Excel");
          const tHeader = [
            "审核时间",
            "轮次",
            "状态",
            "机关处室/二级单位",
            "科室/基层单位",
            "作业队号(集团和公司队号）",
            "QHSEE管理体系要素",
            "涉及要素",
            "审核主题",
            "问题性质（级别）",
            "原因分析",
            "隐患级别",
            "分类",
          ];
          // 上面设置Excel的表格第一行的标题
          const filterVal = [
            "auditTime",
            "round",
            "recordStatus",
            "parentCompanyName",
            "basicCompanyName",
            "operationTeamName",
            "qHSEEManagementFactor",
            "elementsInvolved",
            "auditSubject",
            "questionLevel",
            "causeAnalysis",
            "problemLevel",
            "classify",
          ];
          // 上面的index、phone_Num、school_Name是tableData里对象的属性
          const list = this.excelData.list; //把data里的tableData存到list
          const data = this.formatJson(filterVal, list);
          export_json_to_excel(tHeader, data, "列表excel");
        });
      });
    },

    formatJson(filterVal, jsonData) {
      return jsonData.map((v) => filterVal.map((j) => v[j]));
    },
    gettaskName() {
      GetProblemList2(this.fitertask)
        .then((res) => {
          console.log(res);
          this.taskAyy = res.data.list;
          for (var i = 0; i < this.taskAyy.length; i++) {
            this.taskNameList1.push({ value: this.taskAyy[i].taskName });
          }
          var hash = {};
          this.taskNameList = this.taskNameList1.reduce(function (item, next) {
            hash[next.value]
              ? ""
              : (hash[next.value] = true && item.push(next));
            return item;
          }, []);
          this.loading = false;
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
    },
    clickTable(row) {
      this.$refs.refTable.toggleRowExpansion(row);
    },
    handleSearch() {
      this.filterQuery.pageIdx = 1;
      this.handleGetListData();
    },
    checkFilterParams() {
      // debugger
      //datepicker range 绑定的数据是数组,需要拆成后端识别的2个参数
      if (this.dateRange && this.dateRange.length === 2) {
        this.filterQuery.checkDate1 = this.dateRange[0] + " " + "00:00:00";
        this.filterQuery.checkDate2 = this.dateRange[1] + " " + "23:59:59";
      } else {
        this.filterQuery.checkDate1 = "";
        this.filterQuery.checkDate2 = "";
      }
    },
    loadFilterParams() {
      //从query读取过滤条件
      this.filterQuery = { ...DefaultQuery, ...this.$route.query };
      //从query中取到的参数是string的,要转成element要求的number
      this.filterQuery = {
        ...this.filterQuery,
        num: this.filterQuery.pageIdx,
        size: this.filterQuery.pageSize,
      };

      //填充datepicker range组件的内容

      if (this.filterQuery.checkDate1 && this.filterQuery.checkDate2) {
        this.dateRange = [
          this.filterQuery.checkDate1,
          this.filterQuery.checkDate2,
        ];
      }
    },
    querySearch(queryString, cb) {
      let results = queryString
        ? this.taskNameList.filter(this.createStateFilter(queryString))
        : this.taskNameList;
      clearTimeout(this.timeout);
      this.timeout = setTimeout(() => {
        cb(results);
      }, 1000 * Math.random());
    },
    handleGetListData() {
      // this.checkFilterParams();
      this.loading = true;
      //为了保存过滤条件,我们通过路由的history能力,更换url,从子页面返回的时候,能还原当前条件下的内容
      //this.$router.push({query: this.filterQuery})
      //接口函数,then后面的回调表示成功所执行的内容,catch后面表示错误时所执行的内容
      // this.filterQuery.round = this.filterQuery.round === "" ? 0 : +this.filterQuery.round
      //this.filterQuery.responsePersonID = 0
      // delete this.filterQuery.pageIdx
      // delete this.filterQuery.pageSize
      // debugger
      GetProblemList2(this.filterQuery).then((res) => {
        this.handleGetRechistory(res);
        // this.handleRecfile(res)
        // console.log(this.recHis)
        // console.log(res.data.list)
        // console.log(typeof(res.data.list[0].children[0].rectFile))
        this.tableData = res.data.list;
        this.total = res.data.total;
        this.indexStartNum = this.pageIdx * this.pageSize + 1;
        this.loading = false;
      });
    },

    createStateFilter(queryString) {
      return (taskName) => {
        return (
          taskName.value.toLowerCase().indexOf(queryString.toLowerCase()) !== -1
        );
      };
    },
  },
};
</script>
<style>
.tableTitle {
  position: relative;
  margin: 0 auto;
  width: 100%;
  height: 1px;
  background-color: #d4d4d4;
  text-align: center;
  font-size: 16px;
  color: rgba(101, 101, 101, 1);
}
.midText {
  position: absolute;
  left: 50%;
  background-color: #ffffff;
  padding: 0 15px;
  transform: translateX(-50%) translateY(-50%);
}

.demo-table-expand {
  font-size: 0;
}
.demo-table-expand label {
  width: 90px;
  color: #99a9bf;
}
.demo-table-expand .el-form-item {
  margin-right: 0;
  margin-bottom: 0;
  width: 50%;
}

.el-select-dropdown {
  max-width: 243px;
}
.el-select-dropdown__item {
  display: inline-block;
}
.el-select-dropdown__item span {
  min-width: 205px;
  display: inline-block;
}
</style>
